 <template>
 	<view class="content">
 		<view class="menuBox">
 			<view class="menuBoxItem">
 				<text :class="menuIndex1==1?'active1':''" @click="changeMenu1(1)">工单处理</text>
 				<view class="line">
 				</view>
 				<text :class="menuIndex1==2?'active1':''" @click="changeMenu1(2)">扫码核销</text>
 			</view>
 			<view class="menuBoxItem1" v-if="menuIndex1==1">
 				<text class="state" :class="menuIndex2==1?'active2':''" @click="changeMenu2(1)">待服务</text>
 				<text class="state" :class="menuIndex2==2?'active2':''" @click="changeMenu2(2)">服务中</text>
 			</view>
 		</view>
 		<scroll-view class="itemContainer" scroll-y="true" @scrolltolower="getMore()" v-if="menuIndex1==1">
 			<view class="itemBox">
 				<view class="item" v-for="(item,index) in data" :key="index"
 					@click="$navto.navto('/pages/myorder_waitservice/myorder_waitservice', {id: item.server_id,adminStatus: status,admin:2,majordomo_id:majordomo_id})">
 					<view class="topBox">
 						<view class="orderNum">
 							订单编号：{{item.code}}
 						</view>
 						<view class="orderState" v-if="menuIndex2==1">
 							待服务
 						</view>
 						<view class="orderState" v-if="menuIndex2==2">
 							服务中
 						</view>
 					</view>
 					<view class="centerBox">
 						<image :src="item.cover" class="poster"></image>
 						<text class="name ellipsis">
 							{{item.name}}
 						</text>
 						<text class="num">
 							X {{item.num}}
 						</text>
 						<text class="price">
 							￥{{item.price}}
 						</text>
 					</view>
 					<view class="bottomBox">
 						<text class="allPrice">
 							合计:￥{{item.amount}}
 						</text>
 						<view class="rightBox">
 							<view class="cancel" v-if="status==1" @click.stop="cancel(item.server_id)">
 								取消订单
 							</view>
 							<view class="info">
 								修改进度
 							</view>
 						</view>
 					</view>
 					<view class="selecteType" @click.stop>
 						<uni-data-select v-mode="typeValue" :localdata="type"
 							@change="(e) => changeType(e, item.server_id)" />
 						</uni-data-select>
 					</view>
 				</view>
 			</view>
 		</scroll-view>
 		<view class="scanBox" v-if="menuIndex1==2&&isScan==1">
 			<image :src="baseUrl+'img/my/scan.png'" class="scan" @click="scan"></image>
 			<view class="scanBtn" @click="scan">
 				立即核销
 			</view>
 		</view>
 		<scroll-view class="itemContainer" scroll-y="true" @scrolltolower="getMore()" v-if="menuIndex1==2&&isScan==2">
 			<!-- 餐酒服务 预约状态 1已预约 2使用中 3已完成 4已取消-->
 			<view class="listItem" v-for="(item,index) in data" :key="index">
 				<view v-if="item.cat_name=='餐酒服务'"
 					@click="$navto.navto('/pages/my_subscribe_dinner/my_subscribe_dinner', {id: item.id,status:item.status,admin:2,from:2,majordomo_id:majordomo_id})">
 					<view class="typeBox">
 						<text class="typeLabel">餐酒服务</text>
 						<text class="typeStatus">{{statusArr[item.status-1]}}</text>
 					</view>
 					<view class="orderBox">
 						<view class="orderItem" v-for="(item1,index1) in item.dishes.slice(0, 4)" :key="index1">
 							<image :src="item1.cover" class="orderPoster"></image>
 							<text class="orderName ellipsis">{{item1.name}}</text>
 						</view>
 						<text class="orderDot" v-if="item.dishes.length>4">...</text>
 					</view>
 					<view class="deliveryBox" v-if="item.is_eat==1">
 						<text class="deliveryType">堂食 - 立即就餐</text>
 						<text class="deliveryLine">/</text>
 						<text class="deliveryNum">就餐人数 ： {{item.people_num}} 人</text>
 					</view>
 					<view class="deliveryBox" v-else>
 						<text class="deliveryType">配送</text>
 						<text class="deliveryLine">/</text>
 						<text class="deliveryNum">配送时间 ：{{item.sub_data}} {{item.sub_time}}</text>
 					</view>
 					<view class="priceBox">
 						<text class="price">合计 ：￥{{item.amount}}</text>
 						<view class="priceRight">
 							<view class="cancle" v-if="item.status==1" @click.stop="cancel1(item.id)">
 								取消预约
 							</view>
 							<view class="info" v-else @click.stop="hexiao(item.notif_id)">
 								立即核销
 							</view>
 						</view>
 					</view>
 				</view>
 				<!-- 私宴预定 -->
 				<view v-if="item.cat_name=='私宴预定'"
 					@click="$navto.navto('/pages/my_subscribe_banquet/my_subscribe_banquet', {id: item.id,status:item.status,admin:2,from:2,majordomo_id:majordomo_id})">
 					<view class="typeBox">
 						<text class="typeLabel">私宴预定</text>
 						<text class="typeStatus">{{statusArr[item.status-1]}}</text>
 					</view>
 					<view class="addressBox">
 						<image :src="item.venue.cover" class="addressPoster"></image>
 						<text class="addressName ellipsis">{{item.venue.name}}</text>
 						<text class="address ellipsis">地 址 ：{{item.venue.address}}</text>
 						<text class="addressTime ellipsis">预约时间 ：{{item.sub_data}} / {{item.sub_time}}</text>
 					</view>
 					<text class="label">点菜信息</text>
 					<view class="restaurantBox">
 						<text class="restaurantItem">餐厅名称 ：{{item.dining_name}} </text>
 						<text class="restaurantLine">/</text>
 						<text class="restaurantItem">菜系 ：{{item.cuisine}}</text>
 						<text class="restaurantLine">/</text>
 						<text class="restaurantItem">餐标 ：￥{{item.standard}}</text>
 					</view>
 					<view class="priceBox">
 						<text class="price">合计 ：￥{{item.amount}}</text>
 						<view class="priceRight">
 							<view class="cancle" v-if="item.status==1" @click.stop="cancel1(item.id)">
 								取消预约
 							</view>
 							<view class="info" @click.stop="hexiao(item.notif_id)">
 								立即核销
 							</view>
 						</view>
 					</view>
 				</view>
 				<!-- 场地预约 -->
 				<view v-if="item.cat_name=='场地预约'"
 					@click="$navto.navto('/pages/my_subscribe_place/my_subscribe_place', {id: item.id,status:item.status,admin:2,from:2,majordomo_id:majordomo_id})">
 					<view class="typeBox">
 						<text class="typeLabel">场地预约</text>
 						<text class="typeStatus">{{statusArr[item.status-1]}}</text>
 					</view>
 					<view class="addressBox noBorder">
 						<image :src="item.venue.cover" class="addressPoster"></image>
 						<text class="addressName ellipsis">{{item.venue.name}}</text>
 						<text class="address ellipsis">地 址 ：{{item.venue.address}}</text>
 						<text class="addressTime ellipsis">预约时间 ：{{item.sub_data}} / {{item.sub_time}}</text>
 					</view>
 					<view class="priceBox">
 						<text class="price">合计 ：￥{{item.amount}}</text>
 						<view class="priceRight">
 							<view class="cancle" v-if="item.status==1" @click.stop="cancel1(item.id)">
 								取消预约
 							</view>
 							<view class="info" @click.stop="hexiao(item.notif_id)">
 								立即核销
 							</view>
 						</view>
 					</view>
 				</view>
 				<!-- 宠物预约 -->
 				<view v-if="item.cat_name=='宠物空间'"
 					@click="$navto.navto('/pages/my_subscribe_pet/my_subscribe_pet', {id: item.id,status:item.status,admin:2,from:2,majordomo_id:majordomo_id})">
 					<view class="typeBox">
 						<text class="typeLabel">宠物空间</text>
 						<text class="typeStatus">{{statusArr[item.status-1]}}</text>
 					</view>
 					<view class="addressBox noBorder">
 						<image :src="item.venue.cover" class="addressPoster"></image>
 						<text class="addressName ellipsis">{{item.venue.name}}</text>
 						<text class="address ellipsis">地 址 ：{{item.venue.address}}</text>
 						<text class="addressTime ellipsis">预约时间 ：{{item.sub_data}} / {{item.sub_time}}</text>
 					</view>
 					<view class="priceBox">
 						<text class="price">合计 ：￥{{item.amount}}</text>
 						<view class="priceRight">
 							<view class="cancle" v-if="item.status==1" @click.stop="cancel1(item.id)">
 								取消预约
 							</view>
 							<view class="info" @click.stop="hexiao(item.notif_id)">
 								立即核销
 							</view>
 						</view>
 					</view>
 				</view>
 				<!-- 我的活动 -->
 				<view v-if="item.cat_name=='活动预约'"
 					@click="$navto.navto('/pages/my_subscribe_activity/my_subscribe_activity', {id: item.id,status:item.status,admin:2,from:2,majordomo_id:majordomo_id})">
 					<view class="typeBox">
 						<text class="typeLabel">活动预约</text>
 						<text class="typeStatus">{{statusArr[item.status-1]}}</text>
 					</view>
 					<view class="addressBox noBorder">
 						<image :src="item.activity.title_img" class="addressPoster"></image>
 						<text class="addressName ellipsis">{{item.activity.name}}</text>
 						<text class="address ellipsis">地 址 ：{{item.activity.address}}</text>
 						<text class="addressTime ellipsis" v-if="item.activity">活动时间
 							：{{$timestampToTime(item.activity.start_time)}}至{{$timestampToTime(item.activity.end_time)}}</text>
 					</view>
 					<view class="priceBox">
 						<text class="price">合计 ：{{ item.amount > 0 ? '￥' + item.amount : '免费' }}</text>
 						<view class="priceRight">
 							<view class="cancle" v-if="item.status==1" @click.stop="cancel1(item.id)">
 								取消预约
 							</view>
 							<view class="info" @click.stop="hexiao(item.notif_id)">
 								立即核销
 							</view>
 						</view>
 					</view>
 				</view>
 			</view>
 		</scroll-view>
 		<!-- <view class="scanResult">
 			<template v-if="state==1">
 				<image :src="baseUrl+'img/my/success.png'" class="icon"></image>
 				<text class="result">核销成功</text>
 				<view class="sure">
 					确定
 				</view>
 			</template>
 			<template v-if="state==2">
 				<image :src="baseUrl+'img/my/fail.png'" class="icon"></image>
 				<text class="result">核销失败</text>
 				<view class="sure">
 					再次核销
 				</view>
 			</template>
 		</view> -->
 	</view>
 </template>
 <script>
 	export default {
 		data() {
 			return {
 				baseUrl: this.$baseUrl,
 				menuIndex1: 1,
 				menuIndex2: 1,
 				data: [],
 				isType: false,
 				state: 1,
 				typeValue: '',
 				fullType: [{
 						value: 0,
 						text: '服务中',
 						num: 2
 					},
 					{
 						value: 1,
 						text: '已完成',
 						num: 3
 					}
 				],
 				type: [], // 动态选项
 				page: 1,
 				status: 1,
 				isScan: 1, //显示扫码
 				user: '',
 				hasMore: true,
 				majordomo_id: ''
 			}
 		},
 		onShow() {
 			const returnData = getApp().globalData.returnData || {};
 			if (returnData.back == 1) {
 				if (returnData.type == 1) { //增值服务
 					this.data = this.data.filter(item => item.server_id != returnData.id);
 					getApp().globalData.returnData = null;
 				} else { //隽嘉会
 					this.data = this.data.filter(item => item.id != returnData.id);
 					getApp().globalData.returnData = null;
 				}
 			}
 		},
 		onLoad(options) { //请求增值服务
 			this.updateTypeOptions(this.menuIndex2);
 			this.majordomo_id = options.id;
 			this.getData();
 			this.data = this.data.filter(item => item.server_id != 1);
 			this.$request.get('center').then(res => {
 				this.user = res.data.data;
 			});
 		},
 		watch: {
 			menuIndex2(newVal) {
 				this.updateTypeOptions(newVal);
 			}
 		},
 		methods: {
 			//扫码核销
 			hexiao(id) {
 				uni.showModal({
 					title: '提示',
 					content: '是否确认核销该订单',
 					success: (res) => {
 						if (res.confirm) {
 							this.$request.post(`notif_handle`, {
 								majordomo_id: this.majordomo_id,
 								notif_id: id,
 								notif_status: 3,
 							}).then(res => {
 								if (res.data.code == 10000) {
 									this.$toast('核销成功');
 									this.data = this.data.filter(item => item.notif_id !== id);
 								} else {
 									this.$toast('核销失败');
 								}
 								console.log(res);
 							});
 						} else if (res.cancel) {
 							console.log('用户点击取消');
 						}
 					}
 				});
 			},
 			//取消预约
 			cancel1(id) {
 				uni.showModal({
 					title: '提示',
 					content: '是否确认取消该订单',
 					success: (res) => {
 						if (res.confirm) {
 							this.$request.get(`user_cancel_sub?id=${id}`).then(res => {
 								if (res.data.code == 10000) {
 									this.$toast('取消成功');
 									this.data = this.data.filter(item => item.id !== id);
 								} else {
 									this.$toast('取消失败');
 								}
 							}).catch(err => {
 								console.error('取消请求失败', err);
 								this.$toast('取消失败');
 							});
 						} else if (res.cancel) {
 							console.log('用户点击取消');
 						}
 					}
 				});
 			},
 			//取消订单
 			cancel(id) {
 				uni.showModal({
 					title: '提示',
 					content: '是否确认取消该订单',
 					success: (res) => {
 						if (res.confirm) {
 							this.$request.get(`cancelOrder?id=${id}&type=cancel`).then(res => {
 								if (res.data.code == 10000) {
 									this.$toast('取消成功');
 									this.data = this.data.filter(item => item.server_id !== id);
 								} else {
 									this.$toast('取消失败');
 								}
 							}).catch(err => {
 								console.error('取消请求失败', err);
 								this.$toast('取消失败');
 							});
 						} else if (res.cancel) {
 							console.log('用户点击取消');
 						}
 					}
 				});
 			},
 			scan() { //扫码
 				uni.scanCode({
 					onlyFromCamera: true,
 					success: (res) => {
 						console.log('条码内容：' + res.result);
 						let data = res.result
 						let dataArr = data.split('&');
 						console.log(dataArr);
 						if (dataArr[1] == 1) { //扫码的是个人二维码
 							this.$request.get(`check_sub_list?sn=${dataArr[0]}`).then(res => {
 								console.log(res);
 								if (res.data.data.length > 0) {
 									this.data = res.data.data;
 									this.isScan = 2;
 								} else {
 									this.$toast('暂无预约信息');
 								}
 							});
 						}
 						if (dataArr[1] == 2) { //私宴
 							this.$navto.navto('/pages/my_subscribe_banquet/my_subscribe_banquet', {
 								id: dataArr[0],
 								status: 1,
 								admin: 2,
 								from: 1,
 								majordomo_id: this.majordomo_id
 							})
 						}
 						if (dataArr[1] == 3) { //宠物空间
 							this.$navto.navto('/pages/my_subscribe_pet/my_subscribe_pet', {
 								id: dataArr[0],
 								status: 1,
 								admin: 2,
 								from: 1,
 								majordomo_id: this.majordomo_id
 							})
 						}
 						if (dataArr[1] == 4) { //场地
 							this.$navto.navto('/pages/my_subscribe_place/my_subscribe_place', {
 								id: dataArr[0],
 								status: 1,
 								admin: 2,
 								from: 1,
 								majordomo_id: this.majordomo_id
 							})
 						}
 						if (dataArr[1] == 5) { //活动
 							this.$navto.navto('/pages/my_subscribe_activity/my_subscribe_activity', {
 								id: dataArr[0],
 								status: 1,
 								admin: 2,
 								from: 1,
 								majordomo_id: this.majordomo_id
 							})
 						}
 					}
 				});
 			},
 			getMore() {
 				if (!this.hasMore) {
 					console.log('没有更多数据了');
 					return; // 如果没有更多数据，直接返回
 				}
 				console.log('加载更多');
 				this.page++;
 				this.getData();
 			},
 			getData() {
 				this.$request.get(
 						`notif_list?majordomo_id=${this.majordomo_id}&status=${this.status}&type=1&page=${this.page}`)
 					.then(res => {
 						const newData = res.data.data;
 						if (newData.length > 0) {
 							this.data.push(...newData);
 							// this.data = [...this.data, ...newData].filter(item => item.server_id != 1);
 						} else {
 							this.hasMore = false;
 						}
 					});
 			},
 			changeType(e, id) { //修改订单
 				console.log("e:", e);
 				console.log("id:", id);
 				if (this.menuIndex2 == 2) {
 					this.typeValue = this.type[0].text;
 				} else {
 					this.typeValue = this.type[e].text;
 				}
 				this.$request.post(`notif_handle`, {
 					majordomo_id: this.majordomo_id,
 					notif_id: id,
 					notif_status: this.type[e].num,
 				}).then(res => {
 					if (res.data.code == 10000) {
 						this.$toast('修改成功');
 						this.data = this.data.filter(item => item.server_id !== id);
 					} else {
 						this.$toast('修改失败');
 					}
 					console.log(res);
 				});
 			},
 			changeMenu1(num) {
 				console.log("第一个菜单");
 				if (num == 1) {
 					this.status = 1;
 					this.menuIndex2 = 1;
 					this.getData();
 				}
 				this.data = [];
 				this.menuIndex1 = num;
 				this.page = 1;
 				this.isScan = 1;
 				this.hasMore = true;
 			},
 			updateTypeOptions(menuIndex) {
 				if (menuIndex === 1) {
 					// 待服务 - 只显示"服务中"选项
 					this.type = [this.fullType[0]];
 				} else if (menuIndex === 2) {
 					// 服务中 - 只显示"已完成"选项，但value改为0
 					this.type = [{
 						...this.fullType[1], // 保留其他属性
 						value: 0 // 覆盖value为0
 					}];
 				}
 				this.typeValue = ''; // 重置选择值
 			},
 			// 修改changeMenu2方法
 			changeMenu2(num) {
 				this.data = [];
 				this.menuIndex2 = num;
 				this.status = num;
 				this.page = 1;
 				this.hasMore = true;
 				this.updateTypeOptions(num);
 				this.getData();
 			},
 		}
 	}
 </script>
 <style lang="scss" scoped>
 	.listItem {
 		border-radius: 6rpx;
 		background: #ffffff;
 		padding: 35rpx 30rpx 40rpx 30rpx;
 		position: relative;
 		margin-top: 30rpx;
 		width: 690rpx;
 		box-sizing: border-box;
 		margin-left: 30rpx;

 		.restaurantBox {
 			margin-top: 25rpx;
 			display: flex;
 			justify-content: space-between;
 			align-items: center;

 			.restaurantLine {
 				font-weight: 500;
 				font-size: 22rpx;
 				color: #8E8E8E;
 			}

 			.restaurantItem {
 				font-weight: 500;
 				font-size: 22rpx;
 				color: #121212;
 			}
 		}

 		.label {
 			font-weight: 700;
 			font-size: 24rpx;
 			color: #121212;
 			margin-top: 35rpx;
 			display: block;
 		}

 		.addressBox {
 			padding-bottom: 25rpx;
 			border-bottom: 1rpx dotted #ABABAB;
 			margin-top: 35rpx;
 			position: relative;

 			.address {
 				position: absolute;
 				left: 210rpx;
 				top: 55rpx;
 				font-weight: 500;
 				width: 420rpx;
 				font-size: 21rpx;
 				color: #121212;
 			}

 			.addressTime {
 				position: absolute;
 				left: 210rpx;
 				top: 100rpx;
 				font-weight: 500;
 				width: 420rpx;
 				font-size: 21rpx;
 				color: #121212;

 			}

 			.addressName {
 				position: absolute;
 				left: 210rpx;
 				top: 10rpx;
 				font-weight: 700;
 				width: 420rpx;
 				font-size: 24rpx;
 				color: #121212;
 			}

 			.addressPoster {
 				width: 170rpx;
 				height: 130rpx;
 				border-radius: 10rpx;
 			}
 		}

 		.priceBox {
 			// position: absolute;
 			width: 630rpx;
 			// bottom: 40rpx;
 			// padding-left: 30rpx;
 			// padding-right: 30rpx;
 			margin-top: 35rpx;
 			display: flex;
 			justify-content: space-between;
 			align-items: center;

 			.priceRight {
 				display: flex;

 				.info {
 					width: 130rpx;
 					height: 54rpx;
 					border-radius: 6rpx;
 					background: #121212;
 					font-weight: 500;
 					font-size: 20rpx;
 					color: #FFFFFF;
 					letter-spacing: 5rpx;
 					display: flex;
 					align-items: center;
 					justify-content: center;
 					margin-left: 16rpx;
 				}

 				.cancle {
 					width: 130rpx;
 					height: 54rpx;
 					border-radius: 6rpx;
 					border: 1rpx solid #121212;
 					font-weight: 500;
 					font-size: 20rpx;
 					color: #121212;
 					letter-spacing: 5rpx;
 					display: flex;
 					align-items: center;
 					justify-content: center;
 					box-sizing: border-box;
 				}
 			}

 			.price {
 				color: #121212;
 				font-weight: 700;
 				font-size: 24rpx;
 				letter-spacing: 5rpx;
 			}
 		}

 		.deliveryBox {
 			display: flex;
 			margin-top: 50rpx;

 			.deliveryLine {
 				font-weight: 500;
 				font-size: 22rpx;
 				color: #8E8E8E;
 				margin-left: 45rpx;
 				margin-right: 45rpx;
 			}

 			.deliveryType,
 			.deliveryNum {
 				color: #121212;
 				font-weight: 500;
 				font-size: 22rpx;
 				// letter-spacing: 4rpx;
 			}
 		}

 		.orderBox {
 			margin-top: 32rpx;
 			padding-top: 0rpx 30rpx 0rpx 30rpx;
 			display: flex;

 			.orderDot {
 				margin-left: 40rpx;
 				font-weight: 500;
 				font-size: 30rpx;
 				color: #121212;
 				letter-spacing: 6rpx;
 				line-height: 112rpx;
 			}

 			.orderItem {
 				width: 112rpx;
 				display: flex;
 				flex-direction: column;
 				margin-right: 17rpx;

 				.orderPoster {
 					width: 112rpx;
 					height: 112rpx;
 					border-radius: 10rpx;
 				}

 				.orderName {
 					font-weight: 500;
 					width: 100%;
 					font-size: 18rpx;
 					text-align: center;
 					color: #121212;
 					margin-top: 22rpx;
 				}
 			}
 		}

 		.typeBox {
 			display: flex;
 			justify-content: space-between;
 			align-items: center;
 			border-bottom: 1rpx solid #d0d0d0;
 			padding-bottom: 35rpx;

 			.typeStatus {
 				font-weight: 500;
 				font-size: 24rpx;
 				color: #121212;
 				letter-spacing: 5rpx;
 			}

 			.typeLabel {
 				font-weight: 700;
 				font-size: 28rpx;
 				color: #121212;
 				letter-spacing: 5rpx;
 			}
 		}
 	}

 	.scanResult {
 		width: 100%;
 		display: flex;
 		flex-direction: column;
 		align-items: center;

 		.back {
 			width: 250rpx;
 			height: 80rpx;
 			border-radius: 6rpx;
 			display: flex;
 			justify-content: center;
 			align-items: center;
 			font-weight: 500;
 			font-size: 24rpx;
 			color: #010101;
 			letter-spacing: 5rpx;
 			margin-top: 25rpx;
 			border: 1rpx solid #010101;
 		}

 		.sure {
 			width: 250rpx;
 			height: 80rpx;
 			border-radius: 6rpx;
 			background: #121212;
 			display: flex;
 			justify-content: center;
 			align-items: center;
 			font-weight: 500;
 			font-size: 24rpx;
 			color: #FFFFFF;
 			letter-spacing: 5rpx;
 			margin-top: 90rpx;
 		}

 		.tips {
 			font-weight: 500;
 			font-size: 24rpx;
 			color: #8E8E8E;
 			margin-top: 33rpx;
 		}

 		.result {
 			font-weight: 700;
 			font-size: 32rpx;
 			color: #121212;
 			letter-spacing: 6rpx;
 			margin-top: 50rpx;
 		}

 		.icon {
 			width: 220rpx;
 			height: 220rpx;
 			margin-top: 190rpx;
 		}
 	}

 	.scanBox {
 		width: 100%;
 		display: flex;
 		flex-direction: column;
 		align-items: center;

 		.scanBtn {
 			width: 400rpx;
 			height: 100rpx;
 			line-height: 100rpx;
 			text-align: center;
 			margin-top: 135rpx;
 			border-radius: 10rpx;
 			background-color: #121212;
 			color: #fff;
 			font-size: 28rpx;
 		}

 		.scan {
 			width: 96rpx;
 			height: 86rpx;
 			margin-top: 312rpx;
 		}
 	}

 	.white {
 		background-color: #ffffff !important;
 	}

 	.selecteType {
 		position: absolute;
 		right: 31rpx;
 		width: 144rpx;
 		height: 50%;
 		top: 80%;
 		// opacity: 0;
 	}

 	::v-deep .uni-select {
 		border: none;
 	}

 	::v-deep .uni-select .uni-icons {
 		display: none;
 	}

 	::v-deep .uni-select__input-box {
 		opacity: 0 !important;
 	}

 	.itemContainer {
 		width: 100%;
 		height: calc(100vh - 300rpx);
 		overflow-y: scroll;
 		background-color: #f0f0f0;
 	}

 	.item {
 		width: 100%;
 		height: 390rpx;
 		margin-top: 30rpx;
 		position: relative;
 		height: 390rpx;
 		border-radius: 6rpx;
 		background: #ffffff;

 		.bottomBox {
 			width: 100%;
 			height: 98rpx;
 			display: flex;
 			align-items: center;
 			justify-content: space-between;

 			.rightBox {
 				display: flex;

 				.info {
 					width: 140rpx;
 					height: 54rpx;
 					border-radius: 6rpx;
 					font-weight: 500;
 					font-size: 20rpx;
 					color: #FFFFFF;
 					background-color: #121212;
 					display: flex;
 					justify-content: center;
 					align-items: center;
 					border: 1rpx solid #121212;
 					margin-right: 30rpx;
 					letter-spacing: 5rpx;
 				}

 				.cancel {
 					width: 140rpx;
 					height: 54rpx;
 					border-radius: 6rpx;
 					font-weight: 500;
 					font-size: 20rpx;
 					color: #121212;
 					border: 1rpx solid #121212;
 					display: flex;
 					justify-content: center;
 					align-items: center;
 					margin-right: 15rpx;
 					letter-spacing: 5rpx;
 				}
 			}

 			.allPrice {
 				color: #121212;
 				font-weight: 700;
 				font-size: 24rpx;
 				margin-left: 30rpx;
 				letter-spacing: 5rpx;
 			}
 		}

 		.centerBox {
 			width: 100%;
 			height: 208rpx;
 			border-bottom: 1rpx solid #E7E6E7;
 			display: flex;
 			align-items: center;

 			.price {
 				position: absolute;
 				color: #121212;
 				font-weight: 500;
 				font-size: 26rpx;
 				left: 288rpx;
 				top: 230rpx;
 				letter-spacing: 5rpx;
 			}

 			.num {
 				position: absolute;
 				color: #8e8e8e;
 				font-weight: 500;
 				font-size: 18rpx;
 				left: 288rpx;
 				top: 178rpx;
 			}

 			.name {
 				position: absolute;
 				font-weight: 700;
 				width: 380rpx;
 				font-size: 28rpx;
 				color: #121212;
 				left: 288rpx;
 				top: 120rpx;
 				letter-spacing: 5rpx;
 			}

 			.poster {
 				width: 200rpx;
 				height: 150rpx;
 				margin-left: 30rpx;
 				border-radius: 10rpx;
 			}
 		}

 		.topBox {
 			height: 82rpx;
 			border-bottom: 1rpx solid #E7E6E7;
 			display: flex;
 			justify-content: space-between;
 			align-items: center;
 			padding-left: 30rpx;
 			padding-right: 30rpx;

 			.orderState {
 				font-weight: 500;
 				color: #121212;
 				font-size: 24rpx;
 			}

 			.orderNum {
 				font-weight: 500;
 				font-size: 24rpx;
 				color: #121212;
 			}
 		}
 	}

 	.itemBox {
 		width: 690rpx;
 		margin-left: 30rpx;
 	}

 	.state {
 		padding-bottom: 30rpx;
 		text-align: center;
 	}

 	.active2 {
 		border-bottom: 5rpx solid #121212;
 	}

 	.active1 {
 		font-weight: 700;
 	}

 	.line {
 		height: 26rpx;
 		width: 2rpx;
 		background-color: #d0d0d0;
 	}

 	.menuBoxItem1 {
 		width: 690rpx;
 		height: 100rpx;
 		border-bottom: 1rpx solid #121212;
 		box-sizing: border-box;
 		font-size: 26rpx;
 		display: flex;
 		align-items: center;
 		border: none;
 		padding-left: 95rpx;
 		justify-content: space-between;
 		padding-right: 95rpx;
 		padding-top: 30rpx;
 	}

 	.menuBoxItem {
 		width: 690rpx;
 		height: 100rpx;
 		border-bottom: 1rpx solid #121212;
 		box-sizing: border-box;
 		font-size: 26rpx;
 		display: flex;
 		align-items: center;
 		justify-content: space-around;
 	}

 	.menuBox {
 		width: 100%;
 		height: 200rpx;
 		background-color: #fff;
 		padding-left: 30rpx;
 		padding-right: 30rpx;
 	}

 	.content {
 		width: 100%;
 		height: 100vh;
 		background-color: #f0f0f0;
 		position: fixed;
 	}
 </style>